import React, { Component } from 'react';
import { View, Image, Text, StatusBar, ScrollView, TouchableHighlight, StyleSheet } from "react-native";
import { Carousel, NavigationBar, Label, SearchInput, ListRow } from "teaset";

export default class UserCenter extends Component {
  render() {
    return (
      <View style={{flex:1}}>
            {/* 主体 */}
            <ScrollView>
                {/* 头像框 */}
                <View style={styles.head}>
                    <Image source={require('../../images/2.jpg')} style={styles.headImage} resizeMode='cover' />
                    <View style={styles.control}>
                    
                    </View>
                </View>
                {/* 头像框 结束 */}
            </ScrollView>
            {/* 首页 搜索导航栏 */}
            <NavigationBar
                style={styles.NavigationBar}
                title='我的'
                tintColor='#333'
                titleStyle={styles.titleStyle}
                leftView={<NavigationBar.IconButton icon={require('../../appIcons/type.png')} />}
                rightView={<NavigationBar.IconButton icon={require('../../appIcons/news.png')} />}
            />
            {/* 首页 搜索导航栏  结束 */}

            {/* 系统状态栏 */}
            <StatusBar androidStatusBarColor='rgba(176,13,13,0.54)'  translucent={true}//指定状态栏是否透明。设置为true时，应用会在状态栏之下绘制（即所谓“沉浸式”——被状态栏遮住一部分）。常和带有半透明背景色的状态栏搭配使用。  
            />
      </View>
    );
  }
}
const styles = StyleSheet.create({
    NavigationBar: {
        backgroundColor: 'rgba(255,0,0,1)'
    },
    titleStyle:{
        color:'#333'
    },
    head:{
        height: 300,
        paddingTop: 44,
    },
    headImage:{
        width:'100%',
        height: 300,
    },
    control:{
        
    }
})